How to Setup Your Facebook Connect Application
Update: Since writing this, Facebook has altered the look of the Application Settings page. Now there’s only two major settings that you need to set, and they’re both on the Web Site tab: The Site URL and the Site Domain. Set those correctly and your App will work with SFC. Set them incorrectly, and it will not. So, much simpler, really. 🙂
—
The majority of the email I get from users of the Simple Facebook Connect plugin is questions regarding how to setup their Facebook Application. It’s really not that hard to do, but the plethora of options can seem somewhat intimidating. So here’s the basics of what you need to do.
After creating your application, you’ll need to visit the Apps section in the Facebook Developer Home area. Here you’ll find your application, and the all critical “Edit Settings” link.
Firstly, never give out your Application Secret. If you give this out by accident, then use the Reset Secret Key link to get a new one.
Anyway, from here, you want to go into the settings. The settings area is divided into six main sections, but most of the settings are irrelevant. See, you’re building a “Connect” application, not a “Canvas” one. So most of these are meaningless for you. The following ones are what you actually care about:
Obviously, you want the name of your Application to make sense. I suggest using the same name as your website. You can even use your domain name here if you like. Just be aware that this name is what the Fans of your site will see in their Applications area.
The Basic Information section is important as well, fill it in as you see fit. I also recommend uploading good icons and/or logos for your site. Gives it that finished look.
Contact Information is obviously important as well, but don’t worry about all those extra URLs. They really apply more to Canvas apps. Of course, if you want to make special pages on your site for them and provide the URLs here, feel free.
The Authentication Settings page is surprisingly important. Those top two boxes need to be unchecked for a Facebook Connect application. Why? Because when they are unchecked, your Application becomes an “External Website” as far as Facebook is concerned. If you have either them checked, then your app’s Canvas section becomes active and you might have users trying to add it to their profiles and such, resulting in broken pages and a general bad user experience.
The Connect Settings page is probably the most important one. These settings must be filled in and they must be absolutely accurate. Specifically, the URLs must be the URLs that are actually used by your site. Capitalization matters. The leading “www” or lack of one matters. Whatever the URL your site is in the browser is what you MUST put into these fields. Anything less and your site will not work.
The Advanced Settings screen contains these three fields which you need to set in the same way I did. The email domain no longer exists, however. They removed that in favor of a different approach, so you can ignore that field.
Finally, after you have saved those settings, take the time to go back to the main application screen and click the “Edit Application Profile” link. You’ll be taken here, where you can set up the “look” of your application page on Facebook. This includes what tabs are visible, the stuff in the Info section, etc. You can add extra Applications tabs to this page and generally customize all sorts of stuff. None of that affects your site, but it does affect how the App Page looks in Facebook. The more polished it is, the more likely people will “Fan” your Application. And Fans get updates from when you publish posts to the Wall. Great way to drive traffic to your content.
Hope this helps! Mainly, I hope this reduces the number of questions I get about this process. Enjoy SFC!
I experience some problems when I use it with the woocommerce plugin from Woothemes. Somehow the orders that roll in is also published on Facebook (also if I ad coupons). Both orders and coupons are custom post types.
Why is this?
I am totally lost. I just moved my blog from wordpress.com to wordpress.org. I’ve used plugins on other blogs but not one to connect to a facebook page.
I’ve tried several times and end up making apps but don’t know where to go from there.
Otto, is your apps able to deploy as at MU / network environment?
Hi, I got this error message while attempting to set up the ap:
Error
You have specified an App Domain but have not specified a Site URL or a Mobile Web URL
kindcooking.com must be derived from your Site URL or your Mobile Web URL.
I may be a little over my head here. I am not seeing the same questions on my end. I just want to be able to drop a Fan page like image on my blog. This seems to be an overkill for what I need.
Can you help?
i’m getting the same error too.. comment box is working but that error for app domain is still there
This is an easy one to solve: Go to your application at https://developers.facebook.com/ and fill in the Site URL field correctly.
Thanks Otto and I would gladly buy you the beer but I got stuck pretty quickly. I followed the video and created an application, using my website http://www.yourdailyshakespeare.com. Whereupon I received a confirmation code on my mobile phone, entered it where it was asked. But after that nothing happened. That is where are the API codes, the secret etc.?
Thanks
Jimmie
The confirmation thing is just to confirm your personal Facebook account. You still have to go and actually create the application. If you have done so, then the Application ID and Secret will be obvious on https://developers.facebook.com/apps.
[…] make sure you follow all the steps for registering an app for your domain/website http://ottopress.com/2010/how-to-setup-your-facebook-connect-application/. Sometimes there are issues because of a malformed/wrong url. Posted 15 minutes ago […]
Hi Otto
Loving the plug-in. All set up on moho.biz – have a suggestion: Shortcodes to EXCLUDE the share and like button on certain pages. For instance I have a landing page that does-t need them, but all my posts do.
Regards Bram
I have a problem with the SFC Plugin for wordpress interferes with another Plugin I use. It changes an ampersand “&” to “# 0 3 8 ;” without the blanks of course. The plugin now does not work when SFC is activated. I want to use the other plugin only on a wordpress site to be able to plan routes with google maps…. So is there a way to deactivate it on one static – site, or is there a fix for the problem?
I really dont understand what I am doing wrong with this application but it just doesnt work, otto can you help me i get crazy on this. I am not a programmer! I need help.
Thanks for the screenshots. It made the explanation more clear.
Ok let’s explain i set up a busines funpage from my personal facebook account. Access to the Developer Tools is the only from private one. How to configure, to show the same likes on website and funpage? how to associate, by using the Facebook Application ID and Facebook Secret key, to work with my busines funpage (NO PERSONAL FUNPAGE) and my website?
Kind Regards
Installation problem for facebook.
Thanks man wonderfull information … By reading your article i just made my Facebook Login Button App worked .. Thanks again